<template>
	<div class="bread-crumb">
		<div class="content-wrap">
			<div class="title"><slot name="title"></slot></div>
			<div class="control">
				<el-button
					v-if="refresh"
					type="success"
					icon="el-icon-refresh"
					size="small"
					circle
					@click="actRefresh"
				>
				</el-button>
			</div>
		</div>
		<div class="divider" v-if="divider"></div>
	</div>
</template>

<script>
export default {
	name:'breadCrumb',
	props: {
		//标题
		title:{
			type:String,
			default:''
		},
		//是否显示刷新按钮
		refresh: {
			type   : Boolean,
			default: false,
		},
		//是否显示分隔线
		divider:{
			type:Boolean,
			default:false
		}
	},
	data() {
		return {

		}
	},
	methods:{
		actRefresh(){
			this.$emit("actRefresh")
		}
	}
}
</script>
<style lang="less" scoped>
@import '~@/assets/global.less';
.bread-crumb{
	padding:0 0 5px;
	.content-wrap {
		display: flex;align-items: center;;justify-content: space-between;
		.title{font-size: 16px;font-weight: bold;}
		.control  {}
	}
}
.divider {margin:10px 0px;border-bottom: 1px solid #ddd;}
/* **************************************** 适应 *************************************************/
/* **************************************** 适应 *************************************************/
/* **************************************** 适应 *************************************************/


</style>
